<!DOCTYPE>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <link rel="stylesheet" href="./src/css/cssreset.css">
        <link rel="stylesheet" href="./src/css/header.css">
        <link rel="stylesheet" href="./src/css/swiper-3.4.2.min.css">

        <link rel="stylesheet" href="./src/css/index.css">
        <script src="./src/js/jquery-1.10.2.min.js" charset="utf-8"></script>
        <script src="./src/js/swiper-3.4.2.jquery.min.js" charset="utf-8"></script>
        <style media="screen">
        </style>


        <title>浙江省安全生产数据中心服务应用平台</title>
    </head>

    <body>
        <div class="wrapper">
            <div class="global-content">
                <script src="./src/js/header.js"></script>
                <div class="content clearfix">
                    <div class="section1 clearfix">
                        <div class="section1-left">
                            <div class="section1-left-item">
                                <p class="all-notice ">园区报警处置情况</p>
                                <div class="btn-group claerfix" id="bjqk">
                                    <a href="javascript:;" class="btn first on">月份</a>
                                    <a href="javascript:;" class="btn">日期</a>
                                </div>
                                <div id="zoom-bar" style="width:100%;height:100%;">
                                </div>
                            </div>
                            <div class="section1-left-item">
                                <p class="all-notice ">当日报警详细</p>
                                <div class="btn-group2 claerfix" id="drbj">
                                    <a href="javascript:;" class="btn first on">报警信息</a>
                                    <a href="javascript:;" class="btn">报警类别</a>
                                </div>
                                <div class="section1-box-content">
                                    <div id="dou-pie" style="width:100%;height:100%;display:none;"></div>
                                    <div id="bj-list" style="display:block;">
                                        <table>
                                            <colgroup>
                                                <col style="width:117px;" />
                                                <col style="width:68px;" />
                                                <col style="width:78px;" />
                                                <col style="width:48px;" />
                                            </colgroup>
                                            <thead>
                                                <tr>
                                                    <td>企业名称</td>
                                                    <td>装置名称</td>
                                                    <td>报警参数</td>
                                                    <td>状态</td>
                                                </tr>
                                            </thead>

                                        </table>
                                        <div class="swiper-container">
                                            <div class="swiper-wrapper">
                                                <div class="swiper-slide">
                                                    <table>
                                                        <colgroup>
                                                            <col style="width:117px;" />
                                                            <col style="width:68px;" />
                                                            <col style="width:78px;" />
                                                            <col style="width:48px;" />
                                                        </colgroup>

                                                        <tbody>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜3</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss   no-wrap" style="width:40px;">已处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">甲醇储罐1</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss normal-alert  no-wrap" style="width:40px;">紧急</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                                <div class="swiper-slide">
                                                    <table>
                                                        <colgroup>
                                                            <col style="width:117px;" />
                                                            <col style="width:68px;" />
                                                            <col style="width:78px;" />
                                                            <col style="width:48px;" />
                                                        </colgroup>

                                                        <tbody>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜3</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss   no-wrap" style="width:40px;">已处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">甲醇储罐1</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss normal-alert  no-wrap" style="width:40px;">紧急</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                                <div class="swiper-slide">
                                                    <table>
                                                        <colgroup>
                                                            <col style="width:117px;" />
                                                            <col style="width:68px;" />
                                                            <col style="width:78px;" />
                                                            <col style="width:48px;" />
                                                        </colgroup>

                                                        <tbody>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜3</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">反应釜</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss   no-wrap" style="width:40px;">已处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">甲醇储罐1</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss normal-alert  no-wrap" style="width:40px;">紧急</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                            <tr>
                                                                <th class="no-wrap">
                                                                    <span class="cla1">杭州协和液化气体杭州协和液化气体杭州协和液化气体杭州协和液化气体</span>
                                                                </th>
                                                                <td class="no-wrap">
                                                                    <span class="cla2">
                                                                       <em class="btnss no-wrap" style="width:60px;">氧化器</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla3">
                                                                        <em class="btnss no-wrap" >液位</em>
                                                                         <em class="btnss alert-down  no-wrap" >39.5m</em>
                                                                   </span>

                                                                </td>
                                                                <td class="no-wrap">
                                                                    <span class="cla4">
                                                                       <em class="btnss waring  no-wrap" style="width:40px;">待处理</em>
                                                                   </span>

                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                            <!-- 如果需要分页器 -->
                                            <div class="swiper-pagination"></div>
                                        </div>
                                    </div>


                                </div>

                            </div>
                        </div>
                        <div class="section1-middle">
                            <div class="map-wrapper">
                                <div class="nav-list" id="nav-list">
                                    <ul class="clearfix">
                                        <li>
                                            <a class="icon_splt  " href="javascript:;">企业(23家)</a>
                                        </li>
                                        <li>
                                            <a class="icon_spsc " href="javascript:;">重大危险源(12个)</a>
                                        </li>

                                        <li>
                                            <a class="icon_ypsc  " href="javascript:;">重点工艺(13种)</a>
                                        </li>
                                        <li class="last">
                                            <a class="icon_ylqx icon_turnoff " href="javascript:;">重点监管危化品(12种)</a>
                                        </li>
                                        <li>
                                            <a class="icon_hzpsc " href="javascript:;">应急装备物资</a>
                                        </li>
                                        <li>
                                            <a class="icon_cy" href="javascript:;">应急队伍</a>
                                        </li>
                                        <li>
                                            <a class="icon_yplt " href="javascript:;">危化品车辆</a>
                                        </li>
                                        <li class="last">
                                            <a class="icon_bjpsc  icon_turnoff " href="javascript:;">风险点</a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="map"></div>
                            </div>
                        </div>
                        <div class="section1-right">
                            <div class="section1-right-item section1-right-item1">
                                <div class="video-box clearfix">
                                    <div class="video-item"></div>
                                    <div class="video-item"></div>
                                </div>
                                <div class="charts-nav-wrapper">
                                    <div class="charts-nav-list" id="pie-hook">
                                        <p class="on">重点监管危化品</p>
                                        <p>重点监管化工工艺</p>
                                        <p>重点监管化工工艺</p>
                                    </div>
                                    <div id="pie" style="width:100%;height:100%;"></div>
                                </div>
                            </div>
                            <div class="section1-right-item">
                                <p class="all-notice ">年度事故统计</p>
                                <div class="btn-group claerfix" id='ndsg'>
                                    <a href="javascript:;" class="btn first on">事故起数分类</a>
                                    <a href="javascript:;" class="btn">事故伤亡情况</a>
                                </div>
                                <div id="bar-timeLine" style="width:100%;height:100%;"></div>
                            </div>
                        </div>

                    </div>
                    <div class="section2 clearfix">
                        <div class="section2-left">
                            <p class="all-notice ">企业隐患排查情况</p>
                            <div id="bar2" style="width:100%;height:100%;"></div>
                        </div>
                        <div class="section2-right">
                            <p class="all-notice ">园区风险数</p>
                            <div id="sbowKCharts" style="height:100%;width:100%;"></div>
                        </div>

                    </div>


                </div>
            </div>
        </div>
        <script src="./src/js/after_compatibility.js" charset="utf-8"></script>
        <script src="./src/js/echarts1.min.js" charset="utf-8"></script>
        <script src="./src/js/index.js"></script>

    </body>

</html>
